<!-- 查找好友 -->
{% extends "base.html" %}
{% block title %}知识与你分享{% endblock %}
{% block content %}
    <!-- Breadcome start-->
<div class="breadcome-area mg-b-30 small-dn">
    <div class="container-fluid">
        <div class="row">
            <div class="col-lg-12">
                <div class="breadcome-list shadow-reset">
                    <div class="row">
                        <div class="col-lg-6">
                            <div class="breadcome-heading">
                                <form role="search" class="">
                                    <input type="text" placeholder="Search..." class="form-control">
                                    <a href=""><i class="fa fa-search"></i></a>
                                </form>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <ul class="breadcome-menu">
                                <li><a href=" ">Home</a> <span class="bread-slash">/</span>
                                </li>
                                <li><span class="bread-blod">Contact Profile 2</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Breadcome End-->
    {% if username %}

        <div class="container">
            <div class="row">
                {% for user in users %}

                   <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12" style="padding-bottom: 20px">
                            <div class="contact-client-single shadow-reset ct-client-b-mg-30 ct-client-b-mg-30-n contact-client-v2">
                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="contact-client-img contact-img-v2">
                                            <a href="#"><img src="{{ user.profile.avater }}" alt="">
                                            </a>
                                            <h2><a class="contact-client-name" href="#">{{ user }}</a></h2>
                                            <h1><a id="group" data-type="select" data-pk="1" data-value="5" data-source="/groups" data-title="Select group" href="#" class="editable editable-click">Designer</a></h1>
                                        </div>
                                        <div class="contact-client-address">
                                            <h3>Twitter, Inc.</h3>
                                            <p class="address-client-ct client-addres-v2">Sector: #11, Road No: #17, House No: 06, Block: c2, Uttara, USA.</p>
                                            <p>(123) 456-7890</p>
                                        </div>
                                        <div class="contact-client-footer">
                                            <div class="btn-group">
                                                <a class="btn btn-xs btn-white"><i class="fa fa-phone"></i> Call </a>
                                                <a class="btn btn-xs btn-white"><i class="fa fa-envelope"></i> Email</a>
                                                <a class="btn btn-xs btn-white"><i class="fa fa-facebook"></i> Like</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
            {% endfor %}
           </div>
        </div>

    {% else %}
        {% include "login404.html" %}
    {% endif %}

{% endblock %}